<template>
  <div class="adminInfo">
    <div class="adminMsg">
      <h2>个人中心</h2>
      <el-form v-model="form" :inline="true" label-position="top">
        <el-form-item class="inp" label="账号">
          <el-input v-model="form.username" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item class="inp" label="昵称">
          <el-input v-model="form.name"></el-input>
        </el-form-item>

        <el-form-item class="inp" label="手机号">
          <el-input v-model="form.phone"></el-input>
        </el-form-item>

        <el-form-item class="inp" label="邮箱">
          <el-input v-model="form.email"></el-input>
        </el-form-item>

        <el-form-item class="inp" label="身份证号">
          <el-input v-model="form.idCard"></el-input>
        </el-form-item>

        <el-form-item class="inp" label="所在地址">
          <el-input v-model="form.address"></el-input>
        </el-form-item>

        <el-form-item class="inp" label="出生年月">
          <el-input v-model="form.birth"></el-input>
        </el-form-item>

        <el-form-item class="inp" label="注册时间">
          <el-input v-model="form.createTime" :disabled="true"></el-input>
        </el-form-item>

        <el-form-item class="inp" label="个人描述">
          <el-input v-model="form.info" :rows="6" style="width: 850px;font-size: large" type="textarea"></el-input>
        </el-form-item>
        <br>
        <el-form-item>
          <el-button style="background-color: #4760ff;width: 110px;position: center" type="primary" @click="saveInfo">保 存</el-button>
        </el-form-item>
        <el-form-item>
          <span style="font-size: 13px;font-weight: 500">上次修改时间：{{ form.updateTime }}</span>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
import axios from "axios";

export default {
  name: "AdminInfo",

  created() {
    let user = JSON.parse(localStorage.getItem("login-user"))
  },
  mounted() {
    this.getInfoList();
  },
  data() {
    return {
      form:{},
    }
  },
  methods: {

    getInfoList(){
      axios({
        url: "http://localhost:8090/user/info/"+JSON.parse(localStorage.getItem("login-user")).id,
        method: 'get',
      }).then(res => {
        if(res.code === '200'){
          this.form = res.data
        } else {
          this.$message.error(res.msg)
        }
      })
    },

    saveInfo(){
      axios({
        url: "http://localhost:8090/user/update",
        method: 'put',
        data: this.form
      }).then(res => {
        if(res.code === '200'){
          this.form = res.data
          this.$message.success('修改成功!')
          this.getInfoList();
        } else {
          this.$message.error(res.msg)
        }
      })
    }
  }
}
</script>

<style scoped>
.adminInfo{
  width: 100%;
  min-height: 750px;
  background-color: white;
  padding: 20px 50px;
}

.adminMsg{
  width: 100%;
  height: 720px;
  background-color: white;
  border-radius: 15px;
  padding: 20px 100px;
  box-shadow: 0 0px 14px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)
}

.adminMsg h2{
  font-size: 20px;
  font-weight: 600;
  margin-buttom: 15px;
  margin-left: 0px;
}

.inp{
  width: 500px;
  padding-right: 0px;
  margin-bottom: 10px;
  font-weight: 600;
  font-size: medium;

}
.el-input{
  font-size: medium;
}

/deep/ .el-input.is-disabled .el-input__inner{
  /*background-color: #dbe0e8 !important*/
  background-color: #dbe0e8;
  color: #666565;
}
</style>